<template>
    <el-dialog
            id="customer-genji"
            title="客户跟进（某某珠宝公司）"
            :visible.sync="dialogshow"
            :before-close="dialogClose"
            :fullscreen="fullscreen"
            style="display:none;">
        <dialog-tools
                v-bind:back="true"
                v-bind:next="true"
                v-bind:goback="true"
                v-bind:prev="true"
                v-bind:screen="true"
                @clickfullscreen="clickfullscreen"
        >

        </dialog-tools>
        <div>

            <el-form ref="elForm" :model="formData" :rules="rules" size="medium" label-width="100px">
 
                        <el-form-item label="业务联系人" prop="field108">
                            <el-select v-model="formData.field108" placeholder="请选择业务联系人" clearable
                                       :style="{width: '100%'}">
                                <el-option v-for="(item, index) in field108Options" :key="index" :label="item.label"
                                           :value="item.value" :disabled="item.disabled"></el-option>
                            </el-select>
                        </el-form-item>
<el-row><el-col :span="24" style="margin-left:100px;"><el-link type="primary">13188888888</el-link>&nbsp;&nbsp;
<el-link type="primary" >13166667777</el-link> &nbsp;&nbsp;<el-link type="primary" >88465488@qq.com</el-link>&nbsp;&nbsp;
<el-link type="primary" >微信：Tdfsdf</el-link>
</el-col>

  </el-row>
                        <el-form-item label="跟进方式" prop="field114">
                            <el-select v-model="formData.field114" placeholder="请选择跟进方式" clearable
                                       :style="{width: '100%'}">
                                <el-option v-for="(item, index) in field114Options" :key="index" :label="item.label"
                                           :value="item.value" :disabled="item.disabled"></el-option>
                            </el-select>
                        </el-form-item>

                        <el-form-item label="跟进类型" prop="field110">
                            <el-select v-model="formData.field110" placeholder="请选择跟进类型" clearable
                                       :style="{width: '100%'}">
                                <el-option v-for="(item, index) in field110Options" :key="index" :label="item.label"
                                           :value="item.value" :disabled="item.disabled"></el-option>
                            </el-select>
                        </el-form-item>

                        <el-form-item label="跟进情况" prop="field111">
                            <el-input v-model="formData.field111" type="textarea" placeholder="请输入跟进情况"
                                      :autosize="{minRows: 4, maxRows: 4}" :style="{width: '100%'}"></el-input>
                        </el-form-item>
                        <!-- <el-form-item label="客户状态" prop="field116">
                            <el-select v-model="formData.field116" placeholder="客户状态发生改变时请选择" clearable
                                       :style="{width: '100%'}">
                                <el-option v-for="(item, index) in field116Options" :key="index" :label="item.label"
                                           :value="item.value" :disabled="item.disabled"></el-option>
                            </el-select>
                        </el-form-item> -->
                        <el-form-item label="下次跟进" prop="field113">
                            <el-date-picker v-model="formData.field113" format="yyyy-MM-dd" value-format="yyyy-MM-dd"
                                             placeholder="选择下次跟进日期" clearable></el-date-picker>
                                            <el-time-select
                                              v-model="formData.field115"
                                              :picker-options="{
                                                start: '08:00',
                                                step: '00:15',
                                                end: '21:00'
                                              }"
                                              placeholder="选择时间">
                                            </el-time-select>
                        </el-form-item>
                        

            </el-form>
        </div>
        <div slot="footer" class="dialog-footer">
            <el-button @click="resetForm">重置</el-button>
            <el-button @click="dialogClose">取 消</el-button>
            <el-button type="primary" @click="alertopen">确定</el-button>
        </div>
    </el-dialog>
</template>

<style scoped>

</style>

<script>
  module.exports = {
    methods: {
      dialogAdd () {
        console.log(123)
        console.log(this.dialogCustomerGenji)
      },
      dialogClose () {
        this.$emit('dialog_close', 1)
      },
      clickfullscreen () {
        this.fullscreen = !this.fullscreen
      },
      submitForm () {
        this.$refs['elForm'].validate(valid => {
          if (!valid) return
          // TODO 提交表单
        })
      },
      resetForm () {
        this.$refs['elForm'].resetFields()
      },
      alertopen () {
        this.$confirm('是否继续操作?', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        }).then(() => {
          this.$message({
            type: 'success',
            message: '操作成功!'
          })
        }).catch(() => {
          this.$message({
            type: 'info',
            message: '已取消'
          })
        })
      },
    },
    props: ['dialogshow'],
    data () {
      return {

        formData: {
          field108: '黄先生(业务联系人1)',
          field114: undefined,
          field110: undefined,
          field111: undefined,
          field113: null,
          field115: null,
          field116: null,
        },
        rules: {
          field108: [{
            required: true,
            message: '请选择业务联系人',
            trigger: 'blur'
          }],
          field114: [{
            required: true,
            message: '请选择分类',
            trigger: 'change'
          }],
          field110: [{
            required: true,
            message: '请至少选择一个跟进类型',
            trigger: 'change'
          }],
          field111: [{
            required: true,
            message: '请输入跟进情况',
            trigger: 'blur'
          }],
          // field113: [{
          //   required: true,
          //   message: '请选择下次跟进',
          //   trigger: 'change'
          // }],
        },
        field108Options: [{
          'label': '黄先生(联系人1)',
          'value': 1
        }, {
          'label': '李姐(联系人2)',
          'value': 2
        }, {
          'label': '老王(联系人3)',
          'value': '3'
        }],
        field114Options: [{
          'label': '电话',
          'value': 1
        }, {
          'label': '微信',
          'value': 2
        }, {
          'label': '邮件',
          'value': 3
        }, {
          'label': 'QQ',
          'value': 4
        }, {
          'label': '短信',
          'value': 5
        }, {
          'label': '面谈',
          'value': 6
        }],
        field110Options: [{
          'label': '业务拓展',
          'value': '1'
        }, {
          'label': '签单跟进',
          'value': '2'
        }, {
          'label': '来料跟进',
          'value': '3'
        }, {
          'label': '采购跟进',
          'value': '4'
        }, {
          'label': '生产跟进',
          'value': '5'
        }, {
          'label': '维修跟进',
          'value': '6'
        }, {
          'label': '出货跟进',
          'value': '7'
        }, {
          'label': '运输跟进',
          'value': '8'
        }, {
          'label': '退换货跟进',
          'value': '9'
        }, {
          'label': '收货跟进',
          'value': '10'
        }, {
          'label': '对账跟进',
          'value': '11'
        }, {
          'label': '结款跟进',
          'value': '12'
        }, {
          'label': '结料跟进',
          'value': '13'
        }, {
          'label': '售后跟进',
          'value': '14'
        }],
        field116Options: [{
          'label': '未合作',
          'value': 1
        }, {
          'label': '合作中',
          'value': 2
        }, {
          'label': '中断合作',
          'value': 3
        }],

        dialogChangeGenji: false,
        fullscreen: false,
        Sendmssages: {
          address: '',
          customercate: '',
          cate: '',
          nickname: '',
          creditrank: '',
          name: '',
        },
        customerstaffs: [
          { typename: '员工一' },
          { typename: '员工二' },
          { typename: '员工三' },
          { typename: '员工四' },
        ],
        changeReason: [
          { typename: '原因一' },
          { typename: '原因二' },
          { typename: '原因三' },
          { typename: '原因四' },
        ],
        pickerOptions: {
          shortcuts: [{
            text: '今天',
            onClick (picker) {
              picker.$emit('pick', new Date())
            }
          }, {
            text: '昨天',
            onClick (picker) {
              const date = new Date()
              date.setTime(date.getTime() - 3600 * 1000 * 24)
              picker.$emit('pick', date)
            }
          }, {
            text: '一周前',
            onClick (picker) {
              const date = new Date()
              date.setTime(date.getTime() - 3600 * 1000 * 24 * 7)
              picker.$emit('pick', date)
            }
          }]
        },
        customer: {
          name: '',
          customercode: '',
          customerstatus: '',
          customercate: '',
          creditrank: '',
          creditline: '',
          capital: '',
          annualsales: '',
          bank: '',
          certificateno: '',
          address: '',
          area: '',
          brand: '',
          bankaccount: '',
          trademark: '',
          website: '',
          lperson: '',
          lphone: '',
          contacts: '',

          phone: '',
          phonenum: '',
          weixin: '',
          email: '',
          fax: '',
          resource: '',
          requirement: '',
          ordercountmonth: '',
          purchaseamountmonth: '',
          ordercountyear: '',
          purchaseamountyear: '',
          customerstaffname: '',
          customerstaffcode: '',
          operator: '',
          insertime: '',
          remark: '',
        },
        crmsclientStatic: [
          { typename: 'A级' },
          { typename: 'B级' },
          { typename: 'C级' },
          { typename: 'D级' },
        ],

        scheduleType: [
          { typename: '业务拓展' },
          { typename: '订单跟进' },
          { typename: '料/款跟进' },
        ],

        cates: [
          { typename: '意向客户' },
          { typename: '老客户' },
        ],

        crmsclientRank: [
          { typename: 'A类' },
          { typename: 'B类' },
          { typename: 'C类' },
          { typename: 'D类' },
        ],

      }
    },
    components: {
      'dialog-tools': 'url:../tools/dialog-tools.vue',
    }
  }
</script>
